<style>
.pic{
    text-align: center;
    background: #fff;
	height:100%;
}
.content{
	position:fixed;
    bottom: 3rem;
	top: 3rem;
    left: 0;
    width: 100%;
	padding:10px;
	font-size:1rem;
	color:#2C8DFB;
	background:#fff;
}
.top, .bottom{
	position:fixed;
    z-index: 10;
    left: 0;
    width: 100%;
	padding:0.2rem 0.5rem;
	font-size:1rem;
	color:#2C8DFB;
	background:#fff;
	line-height:2rem;
}
.top{
	top: 0;
}
.bottom{
	bottom: 0;
}
.showimgs{
	position: absolute;
    z-index: 10;
	bottom: 6px;
	right:10px;
	color:#2C8DFB;
	font-size:1.3rem;
}
</style>
<div class="fui-page fui-page-current">
 <div class="top c bold">
	{{pagedata.key}}/{{pagedata.item.images.length}}
	<div href="javascript:;" onclick="$('#myhome').modal();" class="bold showimgs icon icon-category"></div>
 </div>
 <div class="content">
	<div ng-repeat="pic in pagedata.item.images" ng-show="pagedata.key==$index+1" class="pic">
		<img ng-src="{{tomedia(pic) || '../core/resource/images/nopic.jpg'}}" style="display: block; width: 100%; height: 100%;">
	</div>
  </div>
  <div class="bottom">
	<span class="l-f"><i class="icon icon-shouye" style="font-size:1.2rem" ng-click="access_json('jy_dzs/index/');"></i></span>
	<span class="r-f" style="margin-left:3rem" ng-click="pagedata.plus()"><i class="icon icon-qiehuanqiyou"></i></span>
	<span class="r-f" ng-click="pagedata.minus()"><i class="icon icon-qiehuanqizuo"></i></span>
  </div>
  <div id="myhome" class="modal fade" tabindex="-1" style="z-index: 99999; display: none;">
	<div class="modal-dialog" style="width:7rem;top:0;left:0;height:100%">
			<div class='fui-content member-page' style="top:0">
				<div class="fui-cell-group" style="margin-top:0;height:100%;eoverflow-y:scroll">
					<div ng-repeat="pic in pagedata.item.images" class="fui-cell" ng-click="pagedata.cick($index)">
						<div class="fui-cell-label bold" style="width:1.2rem">
							{{$index+1}}
						</div>
						<div class="fui-cell-info" onclick="">
							<img style="height:5rem;width:4rem" src="{{tomedia(pic) || '../core/resource/images/nopic.jpg'}}" />
						</div>
					</div>
				</div>
			</div>
	</div>
	</div>
</div>
<script>
scope.pagedata.key=1;
scope.pagedata.minus=function(){
	if(scope.pagedata.key==1){
		scope.pagedata.key=scope.pagedata.item.images.length
	}
	scope.pagedata.key -=1;
};
scope.pagedata.plus=function(){
	if(scope.pagedata.key==scope.pagedata.item.images.length){
		scope.pagedata.key=1
	}
	scope.pagedata.key++;
};
scope.pagedata.cick=function(index){
	scope.pagedata.key=index+1;
	$('#myhome').modal('hide');
}
</script>